<!DOCTYPE html>
<html>
{include file="public1/_header" /}

<body style="background: #fff;">
<div>
    <div class="layui-row">
        <div class="layui-col-md12">
            <form class="layui-form" action="">
                <div class="layui-card">
                    <div class="layui-card-body" style="overflow: hidden;">
                        <div class="layui-col-md12" style="padding-bottom: 65px;">
                            <table class="layui-table table-form">
                                <colgroup>
                                    <col width="100">
                                    <col>
                                </colgroup>
                                <tbody>
                                <tr>
                                    <th>考勤事件 <span style='color:red'>*</span></th>
                                    <td>
                                        <input lay-reqText="事件必须填写" type="text" name="att_name" required
                                               lay-verify="required" autocomplete="off"
                                               class="layui-input title">
                                    </td>
                                </tr>

                                <tr>
                                    <th>开始时间 <span style='color:red'>*</span></th>
                                    <td><input lay-reqText="开始时间必须选择" type="text" readonly="" id="start_time"
                                               name="start_time" required
                                               lay-verify="required" placeholder="" autocomplete="off"
                                               class="layui-input"></td>
                                </tr>
                                <tr>
                                    <th>结束时间 <span style='color:red'>*</span></th>
                                    <td>
                                        <input lay-reqText="时间必须选择" type="text" readonly="" id="end_time"
                                               name="end_time" required lay-verify="required"
                                               placeholder="" autocomplete="off" class="layui-input">
                                    </td>
                                </tr>
                                <tr>
                                    <th>开启迟到范围 <span style='color:red'>*</span></th>
                                    <td>

                                        <input type="checkbox" checked name="is_range" value="1" lay-skin="switch"
                                               lay-filter="switchTest" lay-text="是|否">


                                    </td>

                                </tr>

                                <tr>
                                    <th>迟到范围</th>
                                    <td>
                                        <input type="number" value="0"oninput="if(value > 20 || value < 1 ){value = 0}" name="att_range" required lay-verify="required"
                                               autocomplete="off" class="layui-input">
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>

                        <div style="text-align: center;" class="layui-layout-admin">
                            <input type="hidden" name="type" value="1">
                            <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                            <button type="button" id="close" class="layui-btn layui-btn-primary">放弃</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    $(function () {
        layui.extend({
            dtree: 'dtree/dtree'
        }).use(['form', 'dtree', 'laydate'], function () {
            var form = layui.form;
            var $ = layui.jquery;
            var laydate = layui.laydate;

            laydate.render({
                elem: '#start_time',
                type: 'time',
                format: 'HH:mm:ss'
            });
            laydate.render({
                elem: '#end_time',
                type: 'time',
                format: 'HH:mm:ss'
            });


//监听指定开关
            form.on('switch(switchTest)', function (data) {

                this.checked ? this.value = 1 : this.value = 0;
            });
            //监听提交
            form.on('submit(formDemo)', function (obj) {
                var index = parent.layer.getFrameIndex(window.name);
                var lfc = top.layerFrameConfig;
                var info = lfc.iframeB.info;

                var data = {
                    att_range: obj.field.att_range,
                    att_name: obj.field.att_name,
                    start_time: obj.field.start_time,
                    type: obj.field.type,
                    end_time: obj.field.end_time,
                    is_range: obj.field.is_range
                }

                $.post("{:url('add')}", data, function (res) {
                    if (res.status == 1) {
                        layer.msg('添加成功', {
                            icon: 1,
                            time: 300
                        }, function () {
                            parent.layer.close(index); //再执行关闭
                            info.reload()
                        });

                    } else {
                        layer.msg(res.message)
                    }
                })
                return false;
            });

            $("#close").click(function () {
                var index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
            })

        });


    })
</script>
</html>
